<template>
  <div class="components-container">
    <!-- 编辑 -->
    <sweet-modal ref="dialog" class="dialog" :sweetModalMaxWidth="pageWidth">
      <h3>{{title}}</h3>
        <!-- <form id="upload" enctype="multipart/form-data" method="post"> 
          <input type="file" name="file" id="pic"/> 
          <input type="button" value="提交" @click="uploadPic();"/> 
          <span class="showUrl"></span> 
          <img src="" class="showPic" alt=""> 
        </form>  -->
        <input accept="image/*" name="upimage" id="upload_file" type="file" @change="imgchange($event)">
        <textarea id="base64_output" name="Word" style=" width:820px"></textarea>
        <input type="button" value="提交" @click="uploadPic();"/> 
    </sweet-modal>
  </div>
  </template>
<style rel="stylesheet/scss" lang="scss" scoped>
@import "src/styles/common.scss";
.el-button + .el-button {
  margin-left: 0;
}

.longtext {
  width: 480px;
}

.longertext {
  width: 480px;
}
.longertexts {
  width: 770px;
}

.sweet-btn {
  margin-top: 20px;
}

.layui-form-label[data-v-7e4f8d8c]{
  width: 82px;
}

.layui-form-labels[data-v-7e4f8d8c]{
  width: 100px;
  margin: 0;
}
</style>

<script>
import apiBase from "@/api/apiBase.js";
import axios from 'axios'
import {
  formatDate,
  timeStringToDate,
  dateStringToDate
} from "@/utils/date.js";
import sweetModal from "@/components/sweetModal";
import { ORDER } from "@/const/orderConst.js";
import header from '@/api/header.js'
import {
  MessageBox,
  Message
} from 'element-ui';

window.onload = function() {
  // Load();
};
window.onunload = function() {
  Unload();
};
// Vue.directives('focus',{
//   inserted: function (el) {
//        el.focus();
//     }
// });
export default {
  name: "selectFileUpload",
  data() {
    return {
      radio1: 3,
      radio2: 3,
      radio3: 3,
      pageWidth: 1000,
      maxHeight: 570,
      title: null,
      isshowphoto: false,
      basearray: [],
      uploadURL: "",
      queryParams: {},
      photoid: null,
      uploadURL: 'http://localhost:11111/Funeral/api/FileConfig/CreateFile',
    };
  },
  methods: {
    imgchange(e){
      var file = e.target.files[0];
      var r = new FileReader();
      r.readAsDataURL(file);
      var s;
      var FRCMBDIDS = ORDER.FRCMBDID;
      var FRCCODNAMES = ORDER.FCMFCSID;
      r.onloadend = function () {
          // 图片的 base64 格式, 可以直接当成 img 的 src 属性值    
          var last= "."+e.target.files[0].name.match(/\.([^\.]+)$/)[1];        
          var dataURL = r.result;
          var w = dataURL.indexOf(',');
          var s = dataURL.substring(w+1);
           let data = {
              FRCMBDID: FRCMBDIDS,
              FRCCODNAME: FRCCODNAMES,
              FileContentBase64: s,
              FleEnt:last,
          };
          apiBase.DoService(
              data,
              apiBase.getApiAdress().FileConfig.CreateFile,
              res => {
                  Message.success('上传成功！')
                  if(res.data.msg == '成功'){
                      Message.success('上传成功！')
                      removeAll();
                  }else{
                      Message.error('上传失败！')
                  }
              }
            );
      };
    },
    uploadPic(){
        console.log(6666);
        console.log(this.imgchange());
    },
    //初始化下拉框数据
    initSelectData() {
      //初始化下拉框数据
      this.getCode();
      this.getCausa();
      this.getHousehold();
      this.getCar();
      this.getCreTypes();
      // this.getIce();
      this.getServiceTypes();
      this.getDrivers();
      this.getAddr();
      // this.getnoIce();
      this.getColumbarium();
      // this.gethallnumber();
    },
    //打开页面
    open(order, id, ids) {
      console.log(111);
      console.log(this.radio1);
      this.order = order;
      this.photoid = id;
      this.isshowphoto = ids;
      console.log(2);
      console.log(this.isshowphoto);
      this.maxHeight = window.innerHeight - 240;
      //清理数据
      console.log(25445);
      console.log(this.order);
      switch (this.order) {
        case "附件上传":
          this.title = '附件上传';
          this.$refs.dialog.open();
          break;
        default:
      }
    },
    //提交
    submit(checkout = false) {
      switch (this.order) {
        case ORDER.SELFREGISTER://自送登记
        case ORDER.REGISTER://火化登记
          this.dataAdd(checkout);//登记新增
          break;
        case ORDER.MODIFY://修改
          this.dataModify(checkout);//登记修改
          break;
        case ORDER.BODYOUTAGE://遗体外运
          this.dataModifyOutage(checkout);
          break;
        case ORDER.BODYOUTAGES://遗体外运1
          this.dataAddOutage(checkout);
          break;
        case ORDER.DELETE:
          break;
        case ORDER.INFO:
          break;
        default:
      }
    },
    //取消按钮
    closeDialog() {
        // console.log(this.order);
      // if (
      //   this.order === ORDER.SELFREGISTER ||
      //   this.order === ORDER.REGISTER ||
      //   this.order === ORDER.MODIFY ||
      //   this.order === ORDER.BODYOUTAGE ||
      //   this.order === ORDER.BODYOUTAGES ||
      //   this.order === ORDER.ADD
      // )
        this.$refs.dialog.close();
      // else if (this.order === ORDER.INFO) this.$refs.dialogInfo.close();
    },
  
  
    refreshData() {
      this.$emit("refreshData");
    },
  },
  components: {
    sweetModal,
  },
  mounted() {//在模板渲染成html后调用，通常是初始化页面完成后，再对html的dom节点进行一些需要的操作。
   
  },
  created() {//在模板渲染成html前调用，即通常初始化某些属性值，然后再渲染成视图。
 
  },
 
};
</script>
